<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>南通统计局数据采集平台</title>
    <link rel="stylesheet" href="../assets/css/style.css">
    <link rel="stylesheet" href="../assets/css/jquery.treeview.css"/>
    <link rel="stylesheet" href="../assets/css/default.css"/>
    <link rel="stylesheet" type="text/css" href="../assets/css/jquery.monthpicker.css">
    <link rel="stylesheet" href="../assets/css/BeatPicker.min.css"/>
    <script type="text/javascript" src="../assets/js/jquery.min.js"></script>
    <script src="../assets/js/jquery.cookie.js" type="text/javascript"></script>
    <script src="../assets/js/jquery.treeview.js" type="text/javascript"></script>
    <script src="../assets/js/BeatPicker.min.js"></script>
    <script src="../assets/js/jquery.monthpicker.js"></script>
    <script src="../assets/js/common.js"></script>
    <script src="../assets/js/json.js" type="text/javascript" charset="gbk"></script>
    <script type="text/javascript">
        $(function () {
            $('#monthly').monthpicker({
                years: [2016, 2015, 2014, 2013, 2012, 2011],
                topOffset: 6
            });
            $('#monthly2').monthpicker({
                years: [2016, 2015, 2014, 2013, 2012, 2011],
                topOffset: 6
            });
            $('#monthly3').monthpicker({
                years: [2016, 2015, 2014, 2013, 2012, 2011],
                topOffset: 6
            });
            $('#monthly4').monthpicker({
                years: [2016, 2015, 2014, 2013, 2012, 2011],
                topOffset: 6
            });
        });
    </script>
</head>
<body>
<!--黑幕-->
<div id="darkdiv">

</div>
<!--提示框-->
<div id="remind">
    <div class="remind">
        <div class="remindtop"><span id="remindname">添加成功</span><img onclick="closeRemind();"
                                                                     src="../assets/img/showclose.jpg"></div>
        <div class="remindmain">
            <img src="../assets/img/successad.jpg">
        </div>
        <div class="remindok">
            <button type="button" onclick="closeRemind();">确定</button>
        </div>
    </div>
</div>


<div class="tj-main">
    <div class="tj-left">
        <div class="JS_panel">
            <div class="tj-tab-panel" style="margin-top: 0;padding-top: 10px;">
                <div class="tj-ewbb-lefttop">
                    <ul id="tree1" class="filetree">
                        <li style="padding-bottom: 0"><span class="folder">H401_2016表  固定资产投资（不含农户）</span>
                            <ul>
                                <li><span class="folder">子表0：基本项</span>
                                    <ul>
                                        <li><a href="">宾栏：FORMBASE</a></li>
                                        <li><a href="">主栏：</a></li>
                                    </ul>
                                </li>
                                <li><span class="folder">子表0：基本项</span>
                                    <ul>
                                        <li><a href="javascript:void(0)" onclick="loadTable();">宾栏：H4010</a></li>
                                        <li><a href="">主栏：H4010</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <script type="text/javascript">
                    $("#tree1").treeview();
                </script>

            </div>
        </div>
        <div>
            <div class="tj-ewbb-span">
                <img src="../assets/img/ewbb-jt.png"><span>H401_2016  固定资产投资（不含农户）完成情况</span>
            </div>
            <table cellspacing="0" cellpadding="0" class="tj-bbzd-table" style="width: 320px;">
                <tr>
                    <td width="120">
                        表格号：
                    </td>
                    <td width="215">
                        <span class="fl">H401TQ_16</span>
                    </td>

                </tr>

                <tr>
                    <td>
                        表号：
                    </td>
                    <td>
                        <input type="text" value="固定资产投资（不含农户）完成情" disabled="disabled">
                    </td>

                </tr>
                <tr>
                    <td>
                        制表机关：
                    </td>
                    <td>
                        <input type="text" value="南通统计局" disabled="disabled">
                    </td>

                </tr>
                <tr>
                    <td>
                        文号：
                    </td>
                    <td>
                        <input type="text" value="" disabled="disabled">
                    </td>

                </tr>
                <tr>
                    <td>
                        同种表编号：
                    </td>
                    <td>
                        <input type="text" value="H401402" disabled="disabled">
                    </td>

                </tr>
                <tr>
                    <td>
                        适用报告期始于：
                    </td>
                    <td>
                        <input type="text" class="input" value="2015-06-01" id="monthly" disabled="disabled">
                    </td>

                </tr>
                <tr>
                    <td>
                        适用报告期止于：
                    </td>
                    <td>
                        <input type="text" class="input" value="2015-06-01" id="monthly2" disabled="disabled">
                    </td>

                </tr>
            </table>
            <div style="text-align: center;">
                <button type="button"
                        style="width: 79px;height: 27px;background-color: #58b95c;color: #fff;border-radius: 3px;">显示设置
                </button>
            </div>
        </div>
    </div>
    <div class="tj-right">
        <div class="tj-bbzd-by tj-overflow">
            <div class="tj-bbzd-table-style" id="Js-table">

            </div>
        </div>

        <div style="display:block;" class="ke-toolbar tj-tbset" unselectable="on">
            <span onclick="changeStyle('b');"
                  class="ke-outline" data-name="bold"
                  title="粗体(Ctrl+B)"
                  unselectable="on"><span
                    class="ke-toolbar-icon ke-toolbar-icon-url ke-icon-bold" unselectable="on"></span></span><span
                class="ke-outline" data-name="italic" title="斜体(Ctrl+I)" onclick="changeStyle('i');"
                unselectable="on"><span
                class="ke-toolbar-icon ke-toolbar-icon-url ke-icon-italic" unselectable="on"></span></span><span
                class="ke-outline" data-name="underline" title="下划线(Ctrl+U)" onclick="changeStyle('u');"
                unselectable="on"><span
                class="ke-toolbar-icon ke-toolbar-icon-url ke-icon-underline" unselectable="on"></span></span>
            <span class="ke-outline" data-name="indent" title="增加缩进" onclick="changeStyle('ap');"
                  unselectable="on"><span
                    class="ke-toolbar-icon ke-toolbar-icon-url ke-icon-indent" unselectable="on"></span></span>
            <span class="ke-outline" data-name="outdent" title="减少缩进" onclick="changeStyle('rp');"
                  unselectable="on"><span
                    class="ke-toolbar-icon ke-toolbar-icon-url ke-icon-outdent" unselectable="on"></span></span>
            <button type="button" onclick="addtr();">添加行</button>
            <input id="addtrnum" type="" value="">
            <button type="button" onclick="deltr();">删除行</button>
            <input id="deltrnum" type="" value="">
            <button type="button" onclick="addColumn();">添加列</button>
            <input id="addtdnum" type="" value="">
            <button type="button" onclick="removeColumn();">删除列</button>
            <input id="deltdnum" type="" value="">
        </div>
    </div>
</div>
<script type="text/javascript">
    var changetext = 0;
    var focus = 0;

    var innertd = "";
    var nowObj;
    $(document).ready(function () {
        $(".JS_tab li").click(function () {
            if ($(".JS_tab li").index(this) == 1) {
                changetext = 1;
                $(".tj-bj-show").removeClass("undis");
            }
            else {
                changetext = 0;
                $(".tj-table-selecttr input")[0].readOnly = true;
                $(".tj-table-selecttr input")[1].readOnly = true;
                $(".tj-table-selecttr input")[2].readOnly = true;
                $(".tj-bj-show").addClass("undis");
            }
            $(".tj-active").removeClass("tj-active");
            $(this).addClass("tj-active");
            $(".JS_panel .tj-tab-panel").addClass("undis");
            $(".JS_panel .tj-tab-panel")[$(".JS_tab li").index(this)].className = "tj-tab-panel";
        });
        $(".JS_table tr").click(function () {
            if ($(this)[0].className != "tj-table-firsttr") {
                if ($(this)[0].className != "tj-table-selecttr") {
                    $(".tj-table-selecttr input")[0].readOnly = true;
                    $(".tj-table-selecttr input")[1].readOnly = true;
                    $(".tj-table-selecttr input")[2].readOnly = true;
                }
                $(".tj-table-selecttr").removeClass("tj-table-selecttr");
                $(this).addClass("tj-table-selecttr");
            }
        });
        $(".JS_table tr").dblclick(function () {
            if (changetext == 1) {
                if ($(this)[0].className != "tj-table-firsttr") {
                    $(".tj-table-selecttr").removeClass("tj-table-selecttr");
                    $(this).addClass("tj-table-selecttr");
                    $(".tj-table-selecttr input")[0].readOnly = false;
                    $(".tj-table-selecttr input")[1].readOnly = false;
                    $(".tj-table-selecttr input")[2].readOnly = false;
                }
            }
        });
        $(".tj-btn-add").click(function () {
            openDark();
        });
        $("#darkdiv").click(function () {
            closeDark();
        });


    });
    function tdClick() {
        $('foucstd').removeClass('foucstd');
        $(this).addClass('foucstd');
        var focustext = "";
        if (innertd == "") {
            innertd = this.innerHTML;
        }
        if (this.firstChild.textContent != "" && this.firstChild.textContent != null) {
            focustext = this.firstChild.textContent;
        }
        var input = "<input onblur='inputBlur(this);' type='text'style='width: 100%;height: 30px;text-align:center;' value='" + focustext + "'>";
        this.innerHTML = input;
        this.firstChild.focus();
    }
    function inputBlur(a) {
        var text1 = a.value;
        var class1 = a.className;
        nowObj = a.parentElement;
        nowObj.innerHTML = innertd;
        nowObj.firstChild.textContent = text1;
        innertd = "";

    }
    function changeStyle(d) {
        if (d == "b") {
            if (nowObj.style.fontWeight == "bold") {
                nowObj.style.fontWeight = "normal";
            }
            else {
                nowObj.style.fontWeight = "bold";
            }
        }
        if (d == "i") {
            if (nowObj.style.fontStyle == "italic") {
                nowObj.style.fontStyle = "normal";
            }
            else {
                nowObj.style.fontStyle = "italic";
            }
        }
        if (d == "u") {
            if (nowObj.style.textDecoration == "underline") {
                nowObj.style.textDecoration = "none";
            }
            else {
                nowObj.style.textDecoration = "underline";
            }
        }
        if (d == "ap") {
            var ap = nowObj.firstChild.style.textIndent;
            if (ap == "") {
                ap = 1;
            }
            else {
                ap = parseInt(ap) + 1;
            }
            nowObj.firstChild.style.textIndent = ap + "em";
        }
        if (d == "rp") {
            var rp = nowObj.firstChild.style.textIndent;
            if (rp != "") {
                rp = parseInt(rp) - 1;
                if (rp > 0) {
                    nowObj.firstChild.style.textIndent = rp + "em";
                }
                else if(rp==0){
                    nowObj.firstChild.style.textIndent="inherit";
                }
            }

        }
    }
    function addtr() {
        $("#Js-table table tbody tr td").unbind("click", tdClick);
        //var trid=0;
        var tab = document.getElementById("ewbb-table");
        var trno = document.getElementById("addtrnum").value;//插入的行数
        if (trno != "" && parseInt(trno) < tab.rows.length - 2) {
            trno = parseInt(trno);
        }
        else {
            trno = tab.rows.length - 2;
        }
        var newTR = tab.insertRow(trno + 2);
        var colums = tab.rows[0].cells.length;
        var xuhao = (newTR.rowIndex - 1).toString();
        for (var i = 0; i < 3; i++) {
            var newNameTD = newTR.insertCell(i);
            newNameTD.innerHTML = "<p></p>";
        }
        for (var i = 3; i < colums; i++) {
            var newNameTD = newTR.insertCell(i);
            newNameTD.innerHTML = "<span></span>";
        }
        for (var i = tab.rows.length - 2; i > newTR.rowIndex - 1; i--) {
            befid = i - 1;
            var remark = document.getElementById("remark" + befid);
            remark.id = "remark" + i;
        }
        newTR.id = "remark" + xuhao;
        $("#Js-table table tbody tr td").bind("click", tdClick);
    }

    var nextid = 0;

    function deltr() {    //alert(trid);\
        var tab = document.getElementById("ewbb-table");
        var trno = document.getElementById("deltrnum").value;//插入的行数
        if (trno != "" && parseInt(trno) < tab.rows.length - 3) {
            trno = parseInt(trno);
        }
        else {
            trno = tab.rows.length - 3;
        }

        var xuhao = parseInt(trno) + 1;
        var row = document.getElementById("remark" + xuhao);
        var index = row.rowIndex;//rowIndex属性为tr的索引值，从0开始
        tab.deleteRow(index);  //从table中删除

        //重新排列序号，如果没有序号，这一步省略
        var nextid;
        for (i = index - 1; i < tab.rows.length; i++) {
            nextid = i + 1;
            var remark = document.getElementById("remark" + nextid);
            remark.id = "remark" + i;
        }
    }

    /* 添加列，采用insertCell(列位置)方法 */
    function addColumn() {
        $("#Js-table table tbody tr td").unbind("click", tdClick);
        var tab = document.getElementById("ewbb-table");
        var len = tab.rows[0].cells.length;
        var trno = document.getElementById("addtdnum").value;//插入的列数
        if (trno != "" && parseInt(trno) < len) {
            trno = parseInt(trno);
        }
        else {
            trno = len;
        }
        if (len > 6) {
            var w = (document.getElementById("ewbb-table").offsetWidth + 100) + "px";
            document.getElementById("ewbb-table").style.width = w;
            $(".tbborder").css("width", w);
        }
        var cell = document.getElementById("ewbb-table").rows[0].insertCell(trno);
        cell.rowSpan = "2";
        cell.width = "100";
        cell.innerHTML = "<p></p>";
        for (var i = 2; i < document.getElementById("ewbb-table").rows.length; i++) {
            var cell = document.getElementById("ewbb-table").rows[i].insertCell(trno);
            cell.innerHTML = "<p></p>";
        }
        $("#Js-table table tr td").bind("click", tdClick);
    }

    /* 删除列，采用deleteCell(列位置)的方法 */
    function removeColumn() {
        var tab = document.getElementById("ewbb-table");
        var len = tab.rows[0].cells.length;
        var trno = document.getElementById("deltdnum").value;//删除的列数
        if (trno != "" && parseInt(trno) < len) {
            trno = parseInt(trno);
        }
        else {
            trno = len;
        }
        var cell = document.getElementById("ewbb-table").rows[0].cells[trno - 1];
        var cellw = cell.offsetWidth;
        if (cell.rowSpan == "2") {
            document.getElementById("ewbb-table").rows[0].deleteCell(trno - 1);
        }
        else {
            document.getElementById("ewbb-table").rows[0].deleteCell(trno - 1);
            document.getElementById("ewbb-table").rows[1].deleteCell(trno - 1);
        }
        for (var i = 2; i < document.getElementById("ewbb-table").rows.length; i++) {
            document.getElementById("ewbb-table").rows[i].deleteCell(trno - 1);
        }
        var w = (document.getElementById("ewbb-table").offsetWidth - cellw) + "px";
        document.getElementById("ewbb-table").style.width = w;
        $(".tbborder").css("width", w);
    }
</script>
</body>
</html>